<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        // 副作用函数: 会产生副作用的函数；该函数执行，会直接或者间接影响其他函数的执行
        let data = {
            text: '我是text文本'
        }
        // effect函数执行，会影响other函数的读取
        function effect () {
            document.body.innerText = data.text
        }
        function other () {
            console.log(document.body.innerText, 'document.body.innerText');
        }
        effect()
        other()
        // 响应式数据: 如果修改obj.text的值之后，effect副作用函数能够自动重新执行，那么obj对象就是一个响应式数据
        data.text = '我是修改后的text文本'
    </script>
</body>
</html>